@import './mixin.scss';
@import './btn.scss';
.modal{
    @include position(fixed);
    z-index: 30;
    transition: all .5s;
    &.slide-enter-active{
        top: 0;
    }
    &.slide-leave-active{
        top: -100%;
    }
    &.slide-enter{
        top: -100%;
    }
    .mask{
        @include position(fiexd);
        background-color: gray;
        opacity: .5;
    }
    .dialog{
        @include position(absolute,50%,40%,600px,auto);
        transform: translate(-50%,-50%);
        background-color: white;
        .dialog_header{
            line-height: 60px;
            padding: 0 25px;
            background-color: gainsboro;
            .icon_close{
                // 背景图+定位
                @include positionImg(absolute,25px,25px,15px,15px,'/img/icon-close.png');
                transition: all .2s;
                &:hover{
                    transform: scale(1.5);
                    transition: all .2s;
                }
            }
        }
        .dialog_body{
            font-size: 16px;
            padding: 42px 40px 54px;
        }
        .dialog_footer{
            line-height: 60px;
            text-align: center;
            background-color: white;
        }
    }
}